<template>
  <div class="w1300">
    <div class="member-group-item" v-for="item in memberData" :key="item.job">
      <h2>{{ item.job }}</h2>
      <member :data="item.data" />
    </div>
  </div>
</template>

<script setup lang="ts">
import { onMounted, reactive } from 'vue'
import member from '../../components/member.vue'
import {
  reqGetRoleList,
  reqGetMemberList,
  reqGetArticleListPage,
} from '../../api/api'

onMounted(() => getRoleList())

const getRoleList = async () => {
  await reqGetRoleList(1)
  await reqGetMemberList({ code: '' })
  await reqGetRoleList(1)
  await reqGetArticleListPage({
    pageNo: 1,
    pageSize: 10,
    id: 1,
    sgId: 0,
    createTimeStart: '2024-04-26T06:43:44.802Z',
    createTimeEnd: '2024-04-26T06:43:44.802Z',
    keywords: 'string',
    type: 'string',
    format: '',
  })
}

const memberData = reactive([
  {
    job: '负责人',
    data: [
      {
        avatar: '',
        username: '王一 · 负责人',
      },
    ],
  },
  {
    job: '博士后',
    data: [
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
    ],
  },
  {
    job: '博士生',
    data: [
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
    ],
  },
  {
    job: '管理员',
    data: [
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
      {
        avatar: '',
        username: '王一 · 负责人',
      },
    ],
  },
])
</script>

<style scoped lang="scss">
.member-group-item {
  padding: 41px 0;
  h2 {
    font-size: 32px;
    margin-bottom: 31px;
  }
}
</style>
